<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>APP用户统计</title>
    <script src = "https://cdn.staticfile.org/echarts/4.3.0/echarts.min.js"></script>
</head>
<body>
<div id = 'homework' style='width: 800px;height:400px;'></div>
<script type = text/javascript>
    var myCharts = echarts.init(document.getElementById('homework'));
    var option = {
        title: {
            text: '标签人数分布', x: 'center', y: 'top',
            subtext: '共190,633人', subtextStyle: {fontSize: 15, fontWeight: '15', color: 'black'}
        },
        legend:{orient: 'vertical',x:'right',y:'top', backgroundColor: '#fffbfb',borderColor:'black',borderWidth: 1,
                itemGap: 3,itemWidth:8, itemHeight: 5,textStyle: {fontSize: 15, fontWeight: '5',color: '#030303'}
        },

        dataset: {
            source: [
                ['流失用户', 183472],
                ['回流用户', 6546],
                ['连续活跃用户', 524],
                ['新用户', 91],
                ['活跃用户', 0]
            ]},

        series:[
            {name:'用户人数',type:'pie',center: ['55%', '65%'],radius: 100, encode:{itemName:0,value:1},
                label:{ show: true, formatter: ' {c} ({d}%)',fontSize: 16}}
        ]
    };

        myCharts.setOption(option);


</script>

</body>
</html>